* {
    box-sizing: border-box;
}
.autocomplete {
    /*the container must be positioned relative:*/
    position: relative;
}
input {
    border: 1px solid transparent;
    background-color: #f1f1f1;
    padding: 10px;
    font-size: 16px;
}
input[type="text"] {
    background-color: #fff;
    width: 100%;
}
.autocomplete-items {
    position: absolute;
    border: 1px solid #d4d4d4;
    border-bottom: none;
    border-top: none;
    z-index: 99;
    /*position the autocomplete items to be the same width as the container:*/
    top: 100%;
    left: 0;
    right: 0;
}
.autocomplete-items div {
    padding: 10px;
    cursor: pointer;
    background-color: #fff;
    border-bottom: 1px solid #d4d4d4;
    color: black;
}
.autocomplete-items div:hover {
    /*when hovering an item:*/
    background-color: #e9e9e9;
}
.autocomplete-active {
    /*when navigating through the items using the arrow keys:*/
    background-color: DodgerBlue !important;
    color: #000000;
}

img,
.img-disable {
    opacity: 0 !important;
}
img,
.img-enable {
    opacity: 1 !important;
}

html {
    min-height: 100%;
}

body {
    position: relative;
}

p.text-danger.error {
    font-size: 0.8rem;
}

.text-bold {
    font-weight: bold !important;
}

ul.pagination > li.active > a,
ul.pagination > li.active > span {
    background-color: #f96332 !important;
    border-color: #f96332 !important;
    color: white !important;
}

ul.pagination > li > a,
ul.pagination > li > span {
    color: #f96332 !important;
}

ul.pagination > li.disabled > a,
ul.pagination > li.disabled > span {
    color: #d4d4d4 !important;
}

.logo > span {
    font-family: "Roboto", Arial, Helvetica, sans-serif;
    font-size: 1rem;
    font-weight: bold;
    color: #888888;
}

ul.links > li {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
}

p.widget.count {
    font-size: 3em;
}

.card > .card-body > .subcard {
    position: relative;
    padding: 20px;
}

/* JQUERY AUTOCOMPLETE DROPDOWN */

@media screen and (min-width: 768px) {
    .ui-autocomplete {
        max-height: 60vh !important;
        overflow-y: auto !important;
        /* prevent horizontal scrollbar */
        overflow-x: hidden !important;
    }
}

.ui-autocomplete {
    max-height: 30vh;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}

/* TOKENIZE2 DROPDOWN */

@media screen and (min-width: 768px) {
    .tokenize-dropdown > .dropdown-menu {
        max-height: 60vh !important;
        overflow-y: auto !important;
        /* prevent horizontal scrollbar */
        overflow-x: hidden !important;
    }
}

.tokenize-dropdown > .dropdown-menu {
    max-height: 40vh;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}

/* JB */
.orange {
    color: #f96332 !important;
}

.bold {
    font-weight: bold !important;
}

.d-n {
    display: none !important;
}

.html5buttons a {
    border: 1px solid #e7eaec;
    background: #fff;
    color: #676a6c;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 6px 8px;
    font-size: 12px;
}

#go-to-top {
    display: none;
    position: fixed;
    bottom: 80px;
    right: 30px;
}

img {
    max-width: 100%;
}

.preview_image {
    overflow: hidden;
    width: 200px !important;
    height: 200px !important;
}

.preview_image {
    overflow: hidden;
    width: 200px !important;
    height: 200px !important;
}

.tns-nav {
    text-align: center;
    margin: 10px 0;
}
.tns-nav > [aria-controls] {
    width: 9px;
    height: 9px;
    padding: 0;
    margin: 0 5px;
    border-radius: 50%;
    background: #ddd;
    border: 0;
}
.tns-nav > .tns-nav-active {
    background: #999;
}

@media screen and (min-width: 768px) {
    .tns-item:not(.tns-slide-active)
        + .tns-slide-active
        + .tns-slide-active
        > img {
        max-width: 60% !important;
        filter: none !important;
        transition: max-width 0.3s;
        transition-delay: 0.1s;
    }
    .tns-item:not(.tns-slide-active)
        + .tns-slide-active
        + .tns-slide-active
        > h4 {
        color: #2c2c2c;
    }
    .tns-item > img {
        max-width: 35%;
        filter: grayscale(100%);
    }

    .tns-item > h4 {
        color: transparent;
    }
}

#tutor-images.image-carousel {
    position: relative;
}

button[aria-controls="tiny-slider"][data-controls="prev"] {
    position: absolute;
    top: 50%;
    z-index: 1;
    left: 0;
}

button[aria-controls="tiny-slider"][data-controls="next"] {
    position: absolute;
    top: 50%;
    z-index: 1;
    right: 0;
}

.pricing-grid-sizer {
    width: 50%;
}

.tokenize > .tokens-container > .token,
.tokenize > .tokens-container > .placeholder,
.tokenize > .tokens-container > .token-search {
    margin: 0 5px 0 0 !important;
}

.token-search > input {
    line-height: normal !important;
}

.tokens-container.form-control {
    padding: 10px 18px 10px 18px !important;
}

.bg-orange {
    background-color: #d84a31 !important;
}

.p-20 {
    padding: 20px !important;
}

.profile-content {
    border-top: none !important;
}

.no-padding {
    padding: 0 !important;
}

.border-left-right {
    border-left: 1px solid #e7eaec;
    border-right: 1px solid #e7eaec;
}

.black {
    color: #000000 !important;
}

.widget-head-color-box-o {
    border-radius: 8px;
    margin-top: 10px;
}

.p-xs {
    padding: 10px !important;
}

.m-b-xxs {
    margin-bottom: 1px;
}

.fa-40 {
    font-size: 40px;
}

/* Pink */
.pink-bg-o,
.bg-pink-o {
    background-color: #ffffff;
    color: #ff578f;
    border: 2px solid #ff578f;
}

.c-pink {
    color: #ff578f;
}

/* Yellow */
.yellow-bg-o,
.bg-warning-o {
    background-color: #ffffff;
    color: #ffc107;
    border: 2px solid #ffc107;
}

.c-yellow {
    color: #ffc107;
}

/* Brown */

.brown-bg-o,
.bg-brown-o {
    background-color: #ffffff;
    color: #795548;
    border: 2px solid #795548;
}

.c-brown {
    color: #795548 !important;
}

/* Purple */

.purple-bg-o,
.bg-purple-o {
    background-color: #ffffff;
    color: #ba68c8;
    border: 2px solid #ba68c8;
}

.c-purple {
    color: #ba68c8 !important;
}

/* Orange */
.orange-bg-o,
.bg-orange-o {
    background-color: #ffffff;
    color: #d84a31;
    border: 2px solid #d84a31;
}

.c-orange {
    color: #d84a31 !important;
}

/* Blue Grey */
.blue-grey-bg-o,
.bg-blue-grey-o {
    background-color: #ffffff;
    color: #7ab2ce;
    border: 2px solid #7ab2ce;
}

.c-blue-grey {
    color: #7ab2ce;
}

/* Blue */
.blue-bg-o,
.bg-blue-o {
    background-color: #ffffff;
    color: #60befb;
    border: 2px solid #60befb;
}

.c-blue {
    color: #60befb;
}

/* Light Blue */
.light-blue-bg-o,
.bg-light-blue-o {
    background-color: #ffffff;
    color: #24c6c8;
    border: 2px solid #35dadc;
}

.c-light-blue {
    color: #24c6c8;
}

/* Red */
.red-bg-o,
.bg-danger-o {
    background-color: #ffffff;
    color: #ec6977;
    border: 2px solid #ec6977;
}

.c-red {
    color: #ec6977;
}

/* Green */
.green-bg-o,
.bg-green-o {
    background-color: #ffffff;
    color: #4bc14e;
    border: 2px solid #62d765;
}

.c-green {
    color: #61d764;
}

/* Teal */

.teal-bg-o,
.bg-teal-o {
    background-color: #ffffff;
    color: #26a69a;
    border: 2px solid #26a69a;
}

.c-teal {
    color: #26a69a;
}

/* Gray */
.gray-bg-o,
.bg-gray-o {
    background-color: #ffffff;
    color: #e0e0e0;
    border: 2px solid #e0e0e0;
}

.c-gray {
    color: #e0e0e0;
}

.custom-wrapper-class input[type="radio"] {
    width: 20px;
}

.custom-wrapper-class input[type="checkbox"] {
    width: 20px;
}

.custom-wrapper-class label {
    display: inline;
    margin-left: 5px;
}

/* Validation for Registration */
.custom-validation-register {
    color: red !important;
    text-align: left !important;
    padding-top: 5px !important;
    padding-left: 10px !important;
    font-size: 12px !important;
    margin-bottom: 0em !important;
}

p.tab {
    margin-left: 20px !important;
}

.modal-header-v2 {
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #dee2e6;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
}

.well {
    margin-bottom: 0px;
    margin: 10px;
    background-color: #ececec;
    padding: 20px;
    border-radius: 8px;
}

.well-gray {
    background-color: #efefef !important;
}

.s-l {
    font-weight: 501 !important;
}

/* View Profile */
.b-r-8 {
    border-radius: 8px !important;
}

img.circle-border {
    border: 3px solid #ffffff;
    border-radius: 50%;
}

.profile-pic {
    max-width: 130px;
    height: 130px;
}

.cursor {
    cursor: default;
}

.padding-profile {
    padding: 15px 20px 20px 20px;
}

.feed-element img.img-circle,
.dropdown-messages-box img.img-circle {
    width: 50px;
    height: 50px;
}

.img-circle {
    border-radius: 50%;
}

.feed-element > .pull-left {
    margin-right: 10px;
}

.badge-green {
    background-color: #00e676 !important;
    color: #ffffff !important;
}

.badge-danger {
    color: #fff !important;
    background-color: #dc3545 !important;
}
.badge-green {
    background-color: #00e676 !important;
    color: #ffffff !important;
}

.general-info-td {
    width: 33.33%;
    font-size: 20px;
}

.red {
    color: red !important;
}

.label-title {
    font-size: 20px !important;
}

.break-word {
    word-break: break-word;
}
/* Pre-loader */

.pre-loader {
    background: #fff;
    background-position: center center;
    background-size: 13%;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 12345;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.pre-loader .loader-logo {
    padding-bottom: 15px;
}
.pre-loader .loader-progress {
    height: 8px;
    border-radius: 15px;
    max-width: 200px;
    margin: 0 auto;
    display: block;
    background: #ecf0f4;
    overflow: hidden;
}
.pre-loader .bar {
    width: 0%;
    height: 8px;
    display: block;
    background: #1b00ff;
}
.pre-loader .percent {
    text-align: center;
    font-size: 24px;
    display: none;
}
.pre-loader .loading-text {
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    padding-top: 15px;
}

label.error {
    color: red;
}

.card-header-dropdown {
    position: absolute;
    right: 20px;
    top: 20px;
}

/* Terms and Condition <li> */
.li-font {
    line-height: 1.61em !important;
    font-weight: 200 !important;
    font-size: 1.2em !important;
    font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
}

/* Registration button */
.cancel-btn {
    background-color: #fff;
    color: #d84a31;
    border: 1px solid #d84a31;
}

.save-btn {
    background: #d84a31;
    color: #fff;
    display: block;
    padding: 15px;
    border-radius: 4px;
    font-size: 20px;
    border: 2px solid transparent;
    min-width: 80px;
    text-align: center;
    min-height: 60px;
    margin: auto;
    text-decoration: none;
}

.save-btn:hover {
    background: transparent;
    color: #000;
    display: block;
    padding: 15px;
    border-radius: 4px;
    font-size: 20px;
    border: 2px solid #d84a31;
    min-width: 80px;
    text-align: center;
    min-height: 60px;
    margin: auto;
    text-decoration: none;
}
@media only screen and (max-width: 540px) {
    .input-title {
        text-align: left !important;
    }
}

/* Tutors : Margin top 20*/
.mr-25 {
    margin-top: 25px !important;
}

.slick-prev:before,
.slick-next:before {
    font-size: 40px !important;
    opacity: 1 !important;
}

.pricing-hover {
    transform: scale(0.9) !important;
}

.d-n {
    display: none !important;
}

.navbar-collapse {
    max-height: 100%;
    /* overflow-y: auto; */
}

.sidebar-collapse .navbar .navbar-nav {
    margin-top: 0px !important;
}


/* https://github.com/jackocnr/intl-tel-input */
.iti__flag {background-image: url("../../plugins/intl-tel-input/img/flags.png");}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .iti__flag {background-image: url("../../plugins/intl-tel-input/img/flags@2x.png");}
}

.iti { width: 100%; }

/* --------------------------------------------- */
/* Replace mm/dd/yyyy to a place holder given to a date*/
input[type="date"]::before {
    color: #999999;
    content: attr(placeholder);
}
/* input[type="date"] {
    color: #ffffff;
} */
input[type="date"]:focus,
input[type="date"]:valid {
    color: #666666;
}
input[type="date"]:focus::before,
input[type="date"]:valid::before {
    content: "" !important;
}

.table-wrapper{
  overflow-x: auto;
}

/* remove Jquery Step's first step's previous button */
.wizard > .actions > ul > li.disabled {
  display: none;
}